<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:a4j="http://richfaces.org/a4j"
                xmlns:rich="http://richfaces.org/rich" template="/templates/template.xhtml"
                xmlns:c="http://java.sun.com/jsp/jstl/core">

    <ui:define name="title">Alumnos</ui:define>
    <ui:define name="main">
        <div class="post">
            <h2 class="title"><a href="#">Bienvenido a Scholar Aragon</a></h2>
            <div class="entry">
                <h:form id="alumnoForm">
                    <f:facet name="header">
                        <h:outputText value="Alumno" />
                    </f:facet>
                    <rich:tabPanel switchType="ajax" headerPosition="top" headerAlignment="center" immediate="true" >
                        <rich:tab id="formTab" header="Formulrario">
                            <h:panelGrid id="formGrid" columns="3">
                                <h:outputText value="#Cuenta:" />
                                <h:inputText label="Cuenta" id="cuenta" required="true" value="#{alumnoController.alumno.id}">
                                    <f:validateLength minimum="5" />
                                </h:inputText>
                                <rich:message for="cuenta" ajaxRendered="true"/>

                                <h:outputText value="Nombre:" />
                                <h:inputText label="Nombre" id="name" required="true"
                                             value="#{alumnoController.alumno.nombre}">
                                    <f:validateLength minimum="4" />
                                </h:inputText>
                                <rich:message for="name" ajaxRendered="true"/>

                                <h:outputText value="Apellido Paterno:" />
                                <h:inputText label="Apellido Paterno" id="apellidoPaterno" required="true"
                                             value="#{alumnoController.alumno.appellidoPaterno}">
                                    <f:validateLength minimum="4" />
                                </h:inputText>
                                <rich:message for="apellidoPaterno" ajaxRendered="true"/>

                                <h:outputText value="Apellido Materno:" />
                                <h:inputText label="Apellido Materno" id="apellidoMaterno" required="true"
                                             value="#{alumnoController.alumno.appellidoMaterno}">
                                    <f:validateLength minimum="4" />
                                </h:inputText>
                                <rich:message for="apellidoMaterno" ajaxRendered="true"/>

                                <h:outputText value="Se Guardo" rendered="#{alumnoController.saved}"/>
                                <f:facet name="footer">
                                    <a4j:commandButton value="Guardar" actionListener="#{alumnoController.save}" render="formTab"/>
                                </f:facet>
                            </h:panelGrid>
                        </rich:tab>
                        <rich:tab id="informationTab" header="Informacion">
                            <rich:dataTable id="alumnoDataTable" value="#{alumnoController.alumnos}" var="alumno" iterationStatusVar="it" rows="10">
                                <rich:column id="indexColumn">
                                    <f:facet name="header">#</f:facet>
                                    <h:outputText value="#{it.index}" />
                                </rich:column>
                                <rich:column id="accountNumberColumn">
                                    <f:facet name="header">Cuenta</f:facet>
                                    <h:outputText value="#{alumno.id}" />
                                </rich:column>
                                <rich:column id="nameColumn">
                                    <f:facet name="header">Nombre</f:facet>
                                    <h:outputText value="#{alumno.nombre}" rendered="#{alumnoController.index ne it.index}"/>
                                    <h:panelGroup rendered="#{alumnoController.index eq it.index}">
                                        <h:inputText id="name" size="10" required="true" value="#{alumnoController.alumno.nombre}">
                                            <f:validateLength minimum="4" />
                                        </h:inputText>
                                        <rich:message for="name" ajaxRendered="true"/>
                                    </h:panelGroup>                                    
                                </rich:column>
                                <rich:column id="fatherLastNameColum">
                                    <f:facet name="header">Paterno</f:facet>
                                    <h:outputText value="#{alumno.appellidoPaterno}" rendered="#{alumnoController.index ne it.index}"/>
                                    <h:panelGroup rendered="#{alumnoController.index eq it.index}">
                                        <h:inputText id="apellidoPaterno" size="10" required="true" value="#{alumnoController.alumno.appellidoPaterno}">
                                            <f:validateLength minimum="4" />
                                        </h:inputText>
                                        <rich:message for="apellidoPaterno" ajaxRendered="true"/>
                                    </h:panelGroup>
                                </rich:column>
                                <rich:column id="motherLastNameColum">
                                    <f:facet name="header">Materno</f:facet>
                                    <h:outputText value="#{alumno.appellidoMaterno}" rendered="#{alumnoController.index ne it.index}"/>
                                    <h:panelGroup rendered="#{alumnoController.index eq it.index}">
                                        <h:inputText id="apellidoMaterno" size="10" required="true" value="#{alumnoController.alumno.appellidoMaterno}">
                                            <f:validateLength minimum="4" />
                                        </h:inputText>
                                        <rich:message for="apellidoMaterno" ajaxRendered="true"/>
                                    </h:panelGroup>
                                </rich:column>
                                <rich:column id="actionColumn">
                                    <f:facet name="header">Acciones</f:facet>
                                    <a4j:commandButton value="Editar" actionListener="#{alumnoController.editar}" render="informationTab" rendered="#{alumnoController.index ne it.index}">
                                        <a4j:param name="index" value="#{it.index}" assignTo="#{alumnoController.index}"/>
                                        <a4j:param name="pk" value="#{alumno.id}" assignTo="#{alumnoController.alumno.id}"/>
                                        <a4j:param name="nombre" value="#{alumno.nombre}" assignTo="#{alumnoController.alumno.nombre}"/>
                                        <a4j:param name="apellidoPaterno" value="#{alumno.appellidoPaterno}" assignTo="#{alumnoController.alumno.appellidoPaterno}"/>
                                        <a4j:param name="apellidoMaterno" value="#{alumno.appellidoMaterno}" assignTo="#{alumnoController.alumno.appellidoMaterno}"/>
                                    </a4j:commandButton>
                                    <h:panelGrid columns="2" rendered="#{alumnoController.index eq it.index}">
                                        <a4j:commandButton value="Modificar" actionListener="#{alumnoController.modificar}" render="informationTab"/>
                                        <a4j:commandButton value="Cancelar" actionListener="#{alumnoController.cancelar}" render="informationTab"/>
                                    </h:panelGrid>
                                </rich:column>
                                <f:facet name="footer">
                                    <rich:dataScroller page="#{alumnoController.page}" />
                                </f:facet>
                            </rich:dataTable>
                        </rich:tab>
                    </rich:tabPanel>
                </h:form>
            </div>
            <div class="byline">
                <p class="meta">July 07, 2010 Posted by <a href="#">Someone</a></p>
                <p class="links"><a href="#">Read More</a><a href="#" title="b0x w">Comments</a></p>
            </div>
        </div>
    </ui:define>
    <ui:define name="side">
        <li>
            <h2>Categories</h2>
            <ul>
                <li><a href="#">Aliquam libero</a></li>
                <li><a href="#">Consectetuer adipiscing elit</a></li>
                <li><a href="#">Metus aliquam pellentesque</a></li>
                <li><a href="#">Suspendisse iaculis mauris</a></li>
                <li><a href="#">Urnanet non molestie semper</a></li>
                <li><a href="#">Proin gravida orci porttitor</a></li>
            </ul>
        </li>
    </ui:define>
</ui:composition>